$(function() {
    $("#k").on("click", function(e) {
        e.preventDefault();
        keysClick($(this));
    });
    $("#dark").on("click", function(e) {
        e.preventDefault();
        keysClick($(this), function() { //回调函数
            var isDark = localStorage.getItem("isDark");
            if (isDark == "true") {
                localStorage.setItem("isDark", "false");
            } else {
                localStorage.setItem("isDark", "true");
            }
            isDarkfun();
        });
    });
    //按钮开关
    function keysClick(obj, callback) {
        var keys = obj.children();
        var yuan = keys.children();
        console.log();
        if (yuan.css("left") == 0 + "px") {
            yuan.css("left", 0.52 + "rem");
            keys.css("backgroundColor", "#22fb35");
            left = 1;
        } else {
            yuan.css("left", "0rem");
            keys.css("backgroundColor", "#f2f2f8");
            left = 0;
        }
        // if (callback) {
        //     callback();
        // }
        callback && callback();
    }
    // 深色模式
    function isDarkfun() {
        var isDark = localStorage.getItem("isDark");
        if (isDark == "true") {
            $("#dark").attr("isDark", "true");
            setTheme();
        } else {
            localStorage.setItem("isDark", "false");
            $("#dark").attr("isDark", "false");
            setTheme2();
        }
    }
    //首次进入页面判断执行深色模式
    isDarkfun();
    //首次进入页面时判断深色模式是否开启，如开启就执行开关函数
    if (localStorage.getItem("isDark") == "true") {
        keysClick($("#dark"));
    }
    // 设置夜间样式
    function setTheme() {
        // 把背景色设置黑色、把文字设置为白色
        $('*').css("color", "#fff");
        $('body,nav ul,header,select,.addbank,.addbank .info input[type="text"],.tel input[type="text"],footer,.form-control').css({
            "background-color": "#000",
        });
        $("ul.c li,.search,.text ul li,.search input[type='text'],.username,footer .left,.weather").css({
            "background-color": "#333"
        });
        $('body').css("opacity", "0.8");
    }

    // 取消夜间样式
    function setTheme2() {
        $('*').css("color", "");
        $("body,nav ul,header,select,ul.c li,.search,.text ul li,.search,.search input[type='text'],footer,.addbank,.addbank .info input[type='text'],.tel input[type='text'],.username,footer .left,.weather,.form-control").css({
            "background-color": "",
        });
        $('body').css("opacity", "");
    }


    var weather = localStorage.getItem("weather");
    //获取存储的时间戳

    if (weather) {
        var wather_json = JSON.parse(weather);
        var weatherTime = JSON.parse(weather).time;
    }
    //每个小时刷新
    if (weather && new Date().getTime() - weatherTime < 1000 * 60 * 60 * 1) {
        // 不需要请求了，直接显示存储的数据
        var wather_json = JSON.parse(weather);
        console.log(wather_json.str);
        $('.weather').prepend(wather_json.str);
    } else {
        // 没有存储数据，那么就去请求
        $.ajax({
            'url': 'http://wthrcdn.etouch.cn/weather_mini?citykey=101280101',
            'type': 'get', // post
            'dataType': "jsonp", // 数据请求类型
            'success': function(data) {
                // 请求成功后，执行这个回调函数
                console.log(data);
                if (data.status == 1000) {
                    //实时温度
                    var wendu = data.data.wendu;
                    //当天时间
                    var currentTime = data.data.forecast[0].date;
                    //温度范围
                    var temperature = data.data.forecast[0].low + data.data.forecast[0].high;
                    //天气
                    var weather = data.data.forecast[0].type;
                    //风向
                    var fengxiang = data.data.forecast[0].fengxiang;
                    //风力  <![CDATA[3级]]>
                    var fengli = data.data.forecast[0].fengli;
                    //截取风力
                    fengli = fengli.match(/CDATA\[(\S*)\]\]/)[1];
                    //城市
                    var currentCity = data.data.city;
                    // var str = `
                    //     <div class="temperature">${wendu}<span>℃<span></div>
                    //     <div class="weather-info">
                    //         <P>${currentTime}</P>
                    //         <P>${currentCity} ${temperature}</P>
                    //         <P>${wind}</P>
                    //     </div>
                    //     <div class="weather-img">
                    //         <img src="${weatherImg}" alt="">
                    //             ${weather}
                    //     </div>`;
                    var str = `
                        <div class="temperature">${wendu}<span>℃<span></div>
                        <div class="weather-info">
                            <P>${currentTime}</P>
                            <P>${currentCity} ${temperature}</P>
                            <P>${fengxiang} ${fengli}</P>
                        </div>
                        <div class="weather-img">
                                ${weather}
                        </div>`;
                    $('.weather').prepend(str);
                    console.log(str);
                    var json = {
                            'str': str,
                            'time': new Date().getTime() // 记录的当前时间戳
                        }
                        // console.log(json);
                    var json_str = JSON.stringify(json);
                    //存储起来
                    localStorage.setItem("weather", json_str);
                }
            }
        });
    }
})